<template>
	<view>
		<view class="item" v-for="(user,index) in affiliateUser" :key="index">
			<view>分销人：{{ user.userName }}</view>
			<view>分销等级：{{ _level(user.level) }}</view>
			<view>状态：{{ _auditState(user.state) }}</view>
			<view v-if="user.state === '2'">拒绝原因：{{ user.auditReason }}</view>
		</view>

		<view class="addSite bg-blue" @tap="jump('/pages/affiliate/affiliate2UserAdd')">
			<view class="add">
				<u-icon name="plus" color="#ffffff" class="icon" :size="30"></u-icon>添加二级分销员
			</view>
		</view>

<!--		<view class="cu-modal" :class="add==true?'show':''">-->
<!--			<view class="cu-dialog">-->
<!--				<view class="cu-bar bg-white justify-end">-->
<!--					<view class="content">添加二级分销员</view>-->
<!--				</view>-->
<!--				<view class="padding-xl">-->
<!--					<view class="item">-->
<!--						<view class="left">二级分销员手机号码</view>-->
<!--						<input type="text" v-model="tel" placeholder-class="line" placeholder="请输入手机号" />-->
<!--					</view>-->
<!--				</view>-->
<!--				<view class="cu-bar bg-white justify-end">-->
<!--					<view class="action margin-0 flex-sub  solid-left" @tap="_cancleAdd()">取消</view>-->
<!--					<view class="action margin-0 flex-sub text-green solid-left" @tap="_doAdd()">确定</view>-->
<!--				</view>-->
<!--			</view>-->
<!--		</view>-->

	</view>
</template>

<script>
	import {
		isNull
	} from '@/lib/java110/utils/StringUtil.js';
	import {
		saveAffiliateLevel2User,
		queryAffiliateUser
	} from "../../api/affiliate/affiliateApi";

	export default {
		data() {
			return {
				add: false,
				affiliateUser: null,
				tel: '',
			}
		},
		computed: {},
		async onLoad() {
			await this._getAffiliateUser();
		},
    async onShow() {
      await this._getAffiliateUser();
    },
		methods: {
			async _getAffiliateUser() {
				let param = {
					page: 1,
					row: 20,
					addType: 2
				};
				try {
					const data = await queryAffiliateUser(param);
					this.affiliateUser = data.data || [];
				} catch (error) {
					console.error('获取分销用户数据出错:', error);
				}
			},

			_add: function() {
				this.add = true;
			},
			_cancleAdd: function() {
				this.add = false;
			},
			_doAdd: function() {
				if (isNull(this.tel)) {
					uni.showToast({
						icon: 'none',
						title: '填写二级分销员手机号码'
					});
					return ''
				}
				saveAffiliateLevel2User({
						tel: this.tel
					}).then(_data => {
						uni.showToast({
							icon: 'none',
							title: _data.msg
						});
						if (_data.code == 0) {
							this.add = false;
							uni.navigateBack({
								delta: 1
							});
							return;
						}
					})
					.catch(error => {
						uni.showToast({
							icon: 'none',
							title: error
						});
					})

			},

			_level: function(_state) {
				if (_state == "1") {
					return "一级"
				}
				if (_state == "2") {
					return "二级"
				}
			},

			_auditState: function(_state) {
				if (_state == "0") {
					return "待审核"
				}
				if (_state == "1") {
					return "审核通过"
				}
				if (_state == "2") {
					return "已拒绝"
				}
			},

			// 路由跳转
			jump(path) {
				this.vc.navigateTo({
					url: path
				})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.item {
		margin: 20upx;
		border-radius: 10upx;
		padding: 30rpx 20rpx;
		background-color: white;

		view {
			padding: 10rpx;
			color: #666;
		}
	}

	.addSite {
		display: flex;
		justify-content: space-around;
		width: 600rpx;
		line-height: 100rpx;
		position: absolute;
		bottom: 30rpx;
		left: 80rpx;
		border-radius: 60rpx;
		font-size: 30rpx;

		.add {
			display: flex;
			align-items: center;
			color: #ffffff;

			.icon {
				margin-right: 10rpx;
			}
		}
	}
</style>
